<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <link rel="Shortcut Icon" href="../../../images/aecc.ico" type="image/x-icon" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="../../../Content/element-plus/index.css">
  <link rel="stylesheet" href="../../../Content/nprogress/nprogress.min.css">
  <link rel="stylesheet" href="../../../styles/vue-page-common.css">
  <script src="../../../Scripts/Array.prototype.flat.js"></script>
  <script src="../../../Scripts/ResizeObserver.js"></script>
  <script src="../../../Content/vue3/vue.global.prod.js"></script>
  <script src="../../../Content/element-plus/index.full.min.js"></script>
  <script src="../../../Content/element-plus/icons-vue.js"></script>
  <script src="../../../Content/element-plus/zh-cn.min.js"></script>
  <script src="../../../Scripts/axios.min.js"></script>
  <script src="../../../Content/nprogress/nprogress.min.js"></script>
  <script src="../../../Scripts/dayjs.min.js"></script>
  <script src="../../../Scripts/axios.config.js"></script>
  <script src="../../../Scripts/crypto-js.min.js"></script>
  <script src="../../../Scripts/secret.js"></script>
  <title>补充入库</title>
</head>

<body>
  <div id="app" style="padding: 10px;" v-cloak>
    <el-form :inline="true" :model="dataObj.queryInfo" :label-position="'left'" :disabled="dataObj.disabled">
      <el-form-item label="主制分厂:">
        <el-select v-model="dataObj.queryInfo.factoryid" placeholder="请选择" style="width: 180px;"
          :disabled="dataObj.factoryidDisabled">
          <el-option v-for="item in dataObj.factoryList" :key="item.factoryid" :label="item.factoryname"
            :value="item.factoryid" />
        </el-select>
      </el-form-item>

      <el-form-item label="订单号:">
        <el-autocomplete :prefix-icon="'Search'" v-model.trim="dataObj.queryInfo.mfgordername" placeholder="请输入订单号"
          :trigger-on-focus="false" :fetch-suggestions="getMfgordernameAsync" :value-key="'mfgordername'"
          :debounce="500" style="width:300px;" clearable>
        </el-autocomplete>
      </el-form-item>

      <el-form-item label="零件号:">
        <el-autocomplete :prefix-icon="'Search'" v-model.trim="dataObj.queryInfo.productname" placeholder="请输入零件号"
          :trigger-on-focus="false" :fetch-suggestions="getProductnameAsync" :value-key="'productname'" :debounce="500"
          style="width:300px;" clearable>
        </el-autocomplete>
      </el-form-item>

      <el-form-item label="批次号:">
        <el-autocomplete :prefix-icon="'Search'" v-model.trim="dataObj.queryInfo.containername" placeholder="请输入批次号"
          :trigger-on-focus="false" :fetch-suggestions="getContainernameAsync" :value-key="'containername'"
          :debounce="500" style="width:300px;" clearable>
        </el-autocomplete>
      </el-form-item>

      <el-form-item label="工序号:">
        <el-input v-model.trim="dataObj.queryInfo.specno" style="width: 240px" placeholder="请输入工序号" clearable />
      </el-form-item>

      <el-form-item label="入库状态:">
        <el-select v-model="dataObj.queryInfo.instorestatus" placeholder="请选择" style="width: 180px;"
          @change="handleInstoreStatusChange">
          <el-option v-for="item in dataObj.statusList" :key="item.value" :label="item.value" :value="item.value" />
        </el-select>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" :icon="'Search'" size="default" @click="getData">查询</el-button>
        <el-button type="primary" :icon="'RefreshRight'" size="default" @click="resetData">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="20">
      <el-col :span="16">
        <el-table :data="dataObj.dataList" stripe border v-loading.fullscreen.lock="dataObj.loading"
          :element-loading-text="dataObj.loadingText" element-loading-background="rgba(0,0,0,0.8)" height="600"
          ref="dataTableRef" @row-click="handleRowClick" highlight-current-row>
          <el-table-column type="index" width="50"></el-table-column>
          <el-table-column prop="mfgordername" label="生产订单号" width="160" show-overflow-tooltip></el-table-column>
          <el-table-column prop="togetherflag" label="件号/批次号" show-overflow-tooltip></el-table-column>
          <el-table-column prop="qty" label="在制数" width="80" show-overflow-tooltip></el-table-column>
          <el-table-column prop="workflowstepname" label="成检工序" width="140" show-overflow-tooltip></el-table-column>
          <el-table-column prop="specno" label="工序号" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column prop="containertypename" label="批次类型" width="120" show-overflow-tooltip></el-table-column>
          <!-- <el-table-column prop="acceptanceqty" label="合格数" width="80" show-overflow-tooltip></el-table-column>
          <el-table-column prop="lossqty" label="报废数" width="80" show-overflow-tooltip></el-table-column>
          <el-table-column prop="defectqty" label="超差数" width="80" show-overflow-tooltip></el-table-column>
          <el-table-column prop="reworkqty" label="返修数" width="80" show-overflow-tooltip></el-table-column> -->
        </el-table>

        <!-- 分页 -->
        <el-pagination style="margin-top: 10px;" @size-change="handleSizeChange" @current-change="handleCurrentChange"
          :current-page="dataObj.currentPage" :page-sizes="[dataObj.pageSize,20,50]" :page-size="dataObj.pageSize"
          layout="prev,pager,next,jumper,sizes,total" :total="dataObj.total">
        </el-pagination>
      </el-col>
      <el-col :span="8">
        <el-table :data="dataObj.containerList" stripe border v-loading.fullscreen.lock="dataObj.loading"
          :element-loading-text="dataObj.loadingText" element-loading-background="rgba(0,0,0,0.8)" height="600"
          ref="containerListRef">
          <el-table-column type="index" width="50"></el-table-column>
          <el-table-column type="selection" width="50"></el-table-column>
          <el-table-column prop="containername" label="流水卡号" show-overflow-tooltip></el-table-column>
          <el-table-column v-if="dataObj.queryInfo.instorestatus === '未入库'" prop="fullname" label="检验人" width="80"
            show-overflow-tooltip></el-table-column>
          <el-table-column v-if="dataObj.queryInfo.instorestatus === '未入库'" prop="createdate" label="检验时间" width="180"
            :formatter="replaceDate"></el-table-column>
          <el-table-column v-if="dataObj.queryInfo.instorestatus === '已入库'" prop="instore_emp" label="入库人" width="80"
            show-overflow-tooltip></el-table-column>
          <el-table-column v-if="dataObj.queryInfo.instorestatus === '已入库'" prop="instore_date" label="入库时间" width="180"
            :formatter="replaceDate"></el-table-column>
        </el-table>
      </el-col>
    </el-row>


    <div style="margin-top: 20px;">
      <el-button v-if="dataObj.queryInfo.instorestatus === '未入库'" :icon="'WarningFilled'" type="warning"
        @click="handleInstoreClick" :disabled="dataObj.disabled">
        补充入库
      </el-button>

      <el-button v-if="dataObj.queryInfo.instorestatus === '已入库'" :icon="'WarningFilled'" type="warning"
        @click="handleCancleInstoreClick" :disabled="dataObj.disabled">
        入库撤销
      </el-button>
    </div>

    <!-- 弹窗表单 -->
    <el-dialog id="instoreDialog" v-model="instoreObj.dialogVisible" title="入库申请" width="95%" :draggable="false"
      align-center :close-on-click-modal="true">
      <!-- 表单 -->
      <el-form :inline="true" :rules="instoreObj.formRules" ref="instoreObjFormRef" :model="instoreObj.form"
        :label-position="'top'">
        <el-form-item label="批次号">
          <el-input v-model="instoreObj.form.containername" disabled></el-input>
        </el-form-item>
        <el-form-item label="批次数量">
          <el-input v-model="instoreObj.form.qty" style="width: 80px;" disabled></el-input>
        </el-form-item>
        <el-form-item label="工序">
          <el-input v-model="instoreObj.form.workflowstepname" disabled style="width: 80px;"></el-input>
        </el-form-item>
        <el-form-item label="零件号">
          <el-input v-model="instoreObj.form.productname" disabled></el-input>
        </el-form-item>
        <el-form-item label="零件名称">
          <el-input v-model="instoreObj.form.productdesc" disabled></el-input>
        </el-form-item>
        <el-form-item label="生产订单号">
          <el-input v-model="instoreObj.form.mfgordername" disabled></el-input>
        </el-form-item>
        <el-form-item label="入库类型">
          <el-select v-model="instoreObj.form.instoreType" placeholder="请选择" style="width: 120px">
            <el-option :key="'正常入库'" :label="'正常入库'" :value="'正常入库'"></el-option>
            <el-option :key="'副产品入库'" :label="'副产品入库'" :value="'副产品入库'"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="生产分厂">
          <el-select v-model="instoreObj.form.originalFactorycode" placeholder="请选择" style="width: 100px">
            <el-option v-for="i in instoreObj.factoryList" :key="i.factoryid" :label="i.factoryname"
              :value="i.attributevalue">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="委托单位">
          <el-select v-model="instoreObj.form.entrustFactorycode" placeholder="请选择" style="width: 100px">
            <el-option v-for="i in instoreObj.factoryList" :key="i.factoryid" :label="i.factoryname"
              :value="i.attributevalue">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="库存位置" prop="stockLocation">
          <el-select v-model="instoreObj.form.stockLocation" placeholder="请选择" style="width: 180px">
            <el-option v-for="i in instoreObj.stockLocationList" :key="i.erpinstorelocatiname" :label="i.lgort"
              :value="i.erpinstorelocatiname">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="机型" prop="productfamily">
          <el-input v-model.trim="instoreObj.form.productfamily" style="width: 100px;"></el-input>
        </el-form-item>
        <el-form-item label="合格数" prop="passqty">
          <el-input v-model.trim="instoreObj.form.passqty" style="width: 80px;" input-style="color:#67C23A;">
            <template #prefix>
              <el-icon color="#67C23A">
                <circle-check-filled />
              </el-icon>
            </template>
          </el-input>
        </el-form-item>
        <el-form-item label="报废数" prop="lossqty">
          <el-input v-model.trim="instoreObj.form.lossqty" style="width: 80px;">
            <template #prefix>
              <el-icon color="#F56C6C">
                <circle-close-filled />
              </el-icon>
            </template>
          </el-input>
        </el-form-item>
        <el-form-item label="提交数" prop="submitqty">
          <el-input v-model.trim="instoreObj.form.submitqty" style="width: 80px;"></el-input>
        </el-form-item>
        <el-form-item label="一次交检合格数" prop="onceQualifiedNum">
          <el-input v-model.trim="instoreObj.form.onceQualifiedNum" style="width: 120px;"></el-input>
        </el-form-item>
        <el-form-item label="质保单数量" prop="qualityPolicyNumber">
          <el-input v-model.trim="instoreObj.form.qualityPolicyNumber" style="width: 120px;"></el-input>
        </el-form-item>
        <el-form-item label="待料单号">
          <el-input v-model.trim="instoreObj.form.replaceMaterialNumber" style="width: 100px;"></el-input>
        </el-form-item>
        <el-form-item label="炉批次顺序号">
          <el-input v-model.trim="instoreObj.form.zlpNum" style="width: 100px;"></el-input>
        </el-form-item>
        <el-form-item label="不合格品审理单号" prop="zbhgdh">
          <el-input v-model.trim="instoreObj.form.zbhgdh" style="width: 160px;"></el-input>
        </el-form-item>
        <el-form-item label="油封日期" prop="oilSealDate">
          <el-date-picker v-model="instoreObj.form.oilSealDate" type="date" value-format="YYYY-MM-DD"
            style="width: 160px;">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="备注">
          <el-input v-model.trim="instoreObj.form.notes"></el-input>
        </el-form-item>
        <el-form-item label="油封周期">
          <el-input v-model.trim="instoreObj.form.oilPeriod"></el-input>
        </el-form-item>
        <el-form-item label="配套发送信息">
          <el-input v-model.trim="instoreObj.form.allsetMsg"></el-input>
        </el-form-item>
        <el-form-item label="配套零件号">
          <el-input v-model.trim="instoreObj.form.allsetProductname"></el-input>
        </el-form-item>
        <el-form-item label="配套批次号">
          <el-input v-model.trim="instoreObj.form.allsetContainername"></el-input>
        </el-form-item>
        <el-form-item label="&nbsp;">
          <el-button type="success" :icon="'Check'" @click="handleInstoreConfirmClick">确认</el-button>
        </el-form-item>
      </el-form>

      <!-- 批次入库信息录入 -->
      <el-tabs v-model="instoreObj.tabObj.container">
        <el-tab-pane label="批次入库信息录入" name="containerInfo">
          <el-table height="250" :data="instoreObj.containerList" ref="instoreObjContainerTableRef" stripe border>
            <el-table-column type="index" width="50"></el-table-column>
            <el-table-column type="selection" width="40"></el-table-column>
            <el-table-column label="id" prop="id" v-if="false"></el-table-column>
            <el-table-column label="批次id" prop="containerid" v-if="false"></el-table-column>
            <el-table-column label="流水卡号" prop="containername" width="160"></el-table-column>
            <el-table-column label="containertype" prop="containertype" v-if="false"></el-table-column>
            <el-table-column label="入库类型" prop="instoreType" width="120">
              <template #default="scope">
                <el-select v-model="scope.row.instoreType" placeholder="请选择">
                  <el-option :key="'正常入库'" :label="'正常入库'" :value="'正常入库'"></el-option>
                  <el-option :key="'副产品入库'" :label="'副产品入库'" :value="'副产品入库'"></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column label="合格数" prop="passqty" width="80">
              <template #default="scope">
                <el-input v-model.trim="scope.row.passqty" @blur="handleInstoreCellBlur('合格数',scope.row)"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="报废数" prop="lossqty" width="80">
              <template #default="scope">
                <el-input v-model.trim="scope.row.lossqty" @blur="handleInstoreCellBlur('报废数',scope.row)"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="一次交检合格数" prop="onceQualifiedNum" width="80">
              <template #default="scope">
                <el-input v-model.trim="scope.row.onceQualifiedNum" @blur="handleInstoreCellBlur('一次交检合格数',scope.row)">
                </el-input>
              </template>
            </el-table-column>
            <el-table-column label="提交数" prop="submitqty" width="80">
              <template #default="scope">
                <el-input v-model.trim="scope.row.submitqty" @blur="handleInstoreCellBlur('提交数',scope.row)"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="生产分厂" prop="originalFactorycode" width="140">
              <template #default="scope">
                <el-select v-model="scope.row.originalFactorycode" placeholder="请选择">
                  <el-option v-for="i in instoreObj.factoryList" :key="i.factoryid" :label="i.factoryname"
                    :value="i.attributevalue">
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column label="委托单位" prop="entrustFactorycode" width="140">
              <template #default="scope">
                <el-select v-model="scope.row.entrustFactorycode" placeholder="请选择">
                  <el-option v-for="i in instoreObj.factoryList" :key="i.factoryid" :label="i.factoryname"
                    :value="i.attributevalue">
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column label="库存位置" prop="stockLocation" width="160">
              <template #default="scope">
                <el-select v-model="scope.row.stockLocation" placeholder="请选择">
                  <el-option v-for="i in instoreObj.stockLocationList" :key="i.erpinstorelocatiname" :label="i.lgort"
                    :value="i.erpinstorelocatiname">
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column label="待料单号" prop="replaceMaterialNumber" width="100">
              <template #default="scope">
                <el-input v-model.trim="scope.row.replaceMaterialNumber"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="机型" prop="productfamily" width="100">
              <template #default="scope">
                <el-input v-model.trim="scope.row.productfamily"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="质保单数量" prop="qualityPolicyNumber" width="100">
              <template #default="scope">
                <el-input v-model.trim="scope.row.qualityPolicyNumber" @blur="handleInstoreCellBlur('质保单数量',scope.row)">
                </el-input>
              </template>
            </el-table-column>
            <el-table-column label="炉批顺序号" prop="zlpNum" width="100">
              <template #default="scope">
                <el-input v-model.trim="scope.row.zlpNum"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="备注" prop="notes" width="100">
              <template #default="scope">
                <el-input v-model.trim="scope.row.notes"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="油封周期" prop="oilPeriod" width="100">
              <template #default="scope">
                <el-input v-model.trim="scope.row.oilPeriod"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="配套发送信息" prop="allsetMsg" width="140">
              <template #default="scope">
                <el-input v-model.trim="scope.row.allsetMsg"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="配套零件号" prop="allsetProductname" width="140">
              <template #default="scope">
                <el-input v-model.trim="scope.row.allsetProductname"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="配套批次号" prop="allsetContainername" width="140">
              <template #default="scope">
                <el-input v-model.trim="scope.row.allsetContainername"></el-input>
              </template>
            </el-table-column>
          </el-table>
        </el-tab-pane>
      </el-tabs>

      <!-- 副产品入库列表 -->
      <el-tabs v-model="instoreObj.tabObj.byproduct">
        <el-tab-pane label="副产品入库列表" name="byproduct">
          <!-- 副产品入库列表-form -->
          <el-form :inline="true" :label-position="'top'" :model="instoreObj.byproductForm"
            :rules="instoreObj.byproductFormRules" ref="byproductFormRef" style="margin-bottom:10px;">
            <el-form-item label="物料编号:" prop="materialNo">
              <el-input v-model.trim="instoreObj.byproductForm.materialNo"></el-input>
            </el-form-item>
            <el-form-item label="提交数:" prop="submitNum">
              <el-input v-model.trim="instoreObj.byproductForm.submitNum" style="width: 120px;"></el-input>
            </el-form-item>
            <el-form-item label="合格数:" prop="qualifiedNum">
              <el-input v-model.trim="instoreObj.byproductForm.qualifiedNum" style="width: 120px;">
                <template #prefix>
                  <el-icon color="#67C23A">
                    <circle-check-filled />
                  </el-icon>
                </template>
              </el-input>
            </el-form-item>
            <el-form-item label="报废数:" prop="lossNum">
              <el-input v-model.trim="instoreObj.byproductForm.lossNum" style="width: 120px;">
                <template #prefix>
                  <el-icon color="#F56C6C">
                    <circle-close-filled />
                  </el-icon>
                </template>
              </el-input>
            </el-form-item>
            <el-form-item label="一次交检合格数:" prop="onceQualifiedNum">
              <el-input v-model.trim="instoreObj.byproductForm.onceQualifiedNum" style="width: 160px;"></el-input>
            </el-form-item>
            <el-form-item label="质保单数:" prop="qualityPolicyNumber">
              <el-input v-model.trim="instoreObj.byproductForm.qualityPolicyNumber" style="width: 120px;"></el-input>
            </el-form-item>
            <el-form-item label="&nbsp;">
              <el-button type="primary" :icon="'Plus'" @click="handleInstoreAddClick">添加</el-button>
              <el-button type="danger" :icon="'Delete'" @click="handleInstoreDeleteClick">删除</el-button>
            </el-form-item>
          </el-form>
          <!-- 副产品入库列表-table -->
          <el-table height="100" :data="instoreObj.dataList" ref="instoreObjTableRef" stripe border>
            <el-table-column type="index" width="50"></el-table-column>
            <el-table-column type="selection" width="40"></el-table-column>
            <el-table-column label="id" prop="id" v-if="false"></el-table-column>
            <el-table-column label="物料编号" prop="materialNo"></el-table-column>
            <el-table-column label="提交数" prop="submitNum"></el-table-column>
            <el-table-column label="合格数" prop="qualifiedNum"></el-table-column>
            <el-table-column label="报废数" prop="lossNum"></el-table-column>
            <el-table-column label="一次交检合格数" prop="onceQualifiedNum"></el-table-column>
            <el-table-column label="质保单数" prop="qualityPolicyNumber"></el-table-column>
          </el-table>
        </el-tab-pane>
      </el-tabs>

      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" :icon="'Check'" @click="handleInstoreSubmitClick">提交</el-button>
          <el-button @click="instoreObj.dialogVisible = false" :icon="'Close'">关闭</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
  <script type="module">
    const { createApp, reactive, ref, toRef, toRefs, onMounted, watch } = Vue
    const { ElMessage, ElLoading, ElMessageBox, ElNotification } = ElementPlus
    import { useInstore } from '../../../Scripts/hooks/containercheck/useInstore.js';

    const App = {
      setup() {
        const api = '../../../Ashx/SupplyContainerInStoreVue3PageHandler.ashx';
        const dataTableRef = ref(null);//表格ref
        const containerListRef = ref(null);
        const userInfo = ref(null);

        // 入库
        const {
          instoreObj,
          instoreObjFormRef,
          instoreObjTableRef,
          byproductFormRef,//副产品维护表单ref
          instoreObjContainerTableRef,//单件单卡批次表格ref
          initInstoreDialogData,
          handleInstoreAddClick,
          handleInstoreDeleteClick,
          handleInstoreConfirmClick,//确认入库信息按钮
          handleInstoreSubmitClick,//【提交】按钮点击
          handleInstoreCellBlur,//批次表格单元格blur事件
        } = useInstore();

        // 获取分厂列表
        async function getFactoryList() {
          const { data: { data, meta, total } } = await axios({
            url: `../../../Ashx/CommonActionHandle.ashx?actions=getFactory`,
            method: 'POST',
            data: { type: "getFactory" }
          })
          if (meta.status === 500) {
            return ElMessage.error(meta.msg);
          }
          return data;
        }

        function keysToLower(obj) {
          // 边界处理：如果传入的不是对象（或 null），直接返回原值
          if (typeof obj !== 'object' || obj === null) {
            return obj;
          }

          const result = {};
          // 遍历对象自身的可枚举属性（不含原型链属性）
          for (const key in obj) {
            if (obj.hasOwnProperty(key)) { // 避免遍历原型链上的属性
              const lowerKey = key.toLowerCase(); // key 转小写
              result[lowerKey] = obj[key]; // 保持 value 不变
            }
          }
          return result;
        }

        // 获取当前用户信息
        async function getUserInfo() {
          const { data: { data, meta, total } } = await axios({
            url: `${api}?actions=getUserInfo`,
            method: 'POST',
            data: { type: "getUserInfo" }
          })
          dataObj.userInfo = data;
          userInfo.value = keysToLower(data);
          if (meta.status === 500) {
            dataObj.disabled = true;//会话失效，当地登录用户不存在时，禁止对页面进行操作
            return ElMessage.error(meta.msg);
          }
          return data;
        }

        let dataObj = reactive({
          userInfo: {},
          loading: false,
          loadingText: '数据加载中...',
          currentPage: 1,// 当前页
          pageSize: 15, // 每页显示条数
          total: 0,
          factoryidDisabled: false,
          disabled: false,//按钮禁用表示
          queryInfo: {
            mfgordername: '',
            productname: '',
            containername: '',
            specno: '',
            instorestatus: '未入库',//入库申请状态
            factoryid: ''
          },
          currentSelectContainer: [],
          factoryList: [],
          dataList: [],
          containerList: [],
          statusList: [
            { value: '未入库', label: '未入库' },
            { value: '已入库', label: '已入库' }
          ]
        })

        // 查询数据
        async function getData() {
          dataObj.containerList = [];
          dataObj.loading = true;
          dataObj.loadingText = '数据加载中...';
          const actions = dataObj.queryInfo.instorestatus === '未入库' ? 'getData' : 'getInstoreToWMSData';
          const { data: { data, meta, total } } = await axios({
            url: `${api}?actions=${actions}`,
            method: 'post',
            data: {
              type: `${actions}`,
              ...dataObj.queryInfo,
              currentPage: dataObj.currentPage,
              pageSize: dataObj.pageSize
            }
          })
          dataObj.loading = false
          if (meta.status === 500) {
            return ElMessage.error(meta.msg);
          }
          dataObj.dataList = data;
          dataObj.total = total;
        };

        // 表格行鼠标点击事件
        async function handleRowClick(row) {
          const { mfgorderid, togetherflag, workflowstepid } = row;
          dataObj.currentSelectContainer = {
            workflowstepname: row.workflowstepname,
            productid: row.productid,
            productname: row.productname,
            productdescription: row.description,
            workflowstepid: row.workflowstepid,
            workflowid: row.workflowid
          };
          dataObj.loading = true;
          dataObj.loadingText = '数据加载中...';

          const actions = dataObj.queryInfo.instorestatus === '未入库' ? 'getContainerList' : 'getInstoreToWMSDataDetail';

          const { data: { data, meta, total } } = await axios({
            url: `${api}?actions=${actions}`,
            method: 'post',
            data: {
              type: `${actions}`,
              mfgorderid, togetherflag, workflowstepid,
              factoryid: dataObj.queryInfo.factoryid
            }
          })
          dataObj.loading = false
          if (meta.status === 500) {
            return ElMessage.error(meta.msg);
          }
          dataObj.containerList = data;
          containerListRef.value.toggleAllSelection();//默认全选
        }

        // 入库申请状态下拉框变更事件
        function handleInstoreStatusChange(value) {
          dataObj.dataList = [];
          dataObj.containerList = [];
        }

        // 补充入库
        async function handleInstoreClick() {
          const selectionRows = containerListRef.value.getSelectionRows();
          if (selectionRows.length == 0) {
            return ElMessage.error('请选择批次');
          }
          instoreObj.dialogVisible = true;
          initInstoreDialogData(dataObj.currentSelectContainer, selectionRows, userInfo);
        }

        // 入库撤销
        async function handleCancleInstoreClick() {
          const selectionRows = containerListRef.value.getSelectionRows();
          if (selectionRows.length == 0) {
            return ElMessage.error('请选择批次');
          }

          ElMessageBox.confirm(`你确认要入库撤销吗?`, '确认', { type: 'warning' }).then(async () => {
            const { data: { data, meta, total } } = await axios({
              url: `${api}?actions=cancelInstore`,
              method: 'post',
              data: {
                type: `cancelInstore`,
                postData: selectionRows,
                employeeid: userInfo.value.employeeid
              }
            })
            if (data) {
              ElMessage({ type: 'success', message: `入库撤销成功`, grouping: true });
              dataObj.dataList = [];
              dataObj.containerList = [];
            } else {
              return ElMessage.error(meta.msg);
            }
          }).catch(() => {
            ElMessage({ type: 'info', message: '已取消' });
          });
        }

        function handleCurrentChange(newPage) {
          dataObj.currentPage = newPage;
          getData();
        };

        function handleSizeChange(newSize) {
          dataObj.pageSize = newSize;
          getData();
        };

        const splitDate = (row, column, cellValue, index) => {
          return cellValue && cellValue.includes('T') ? cellValue.split('T')[0] : cellValue;
        }

        const replaceDate = (row, column, cellValue, index) => {
          return cellValue && cellValue.includes('T') ? cellValue.replace('T', ' ') : cellValue;
        }

        function getMfgordernameAsync(value, callback) {
          fetchSuggestion({ url: '../../../Ashx/CommonActionHandle.ashx', method: 'getMfgordernameAsync', name: 'mfgordername', value, callback });
        }

        function getProductnameAsync(value, callback) {
          fetchSuggestion({ url: '../../../Ashx/CommonActionHandle.ashx', method: 'getProductnameAsync', name: 'productname', value, callback });
        }

        function getContainernameAsync(value, callback) {
          fetchSuggestion({ url: '../../../Ashx/CommonActionHandle.ashx', method: 'getContainernameAsync', name: 'containername', value, callback });
        }

        // 输入建议
        const fetchSuggestion = async (config) => {
          const triggerLength = config.triggerLength || 4;
          if (config.value && config.value.length >= triggerLength) {
            const { data: res } = await axios.post(`${config.url}?action=${config.method}`, {
              type: config.method,
              [config.name]: config.value
            })
            if (res.meta.status === 500) {
              return ElMessage.error(res.meta.msg);
            }
            const result = res.data.filter(item => item.rownum < 100);
            config.callback(result);
          }
        }

        // 重置
        function resetData() {
          dataObj.queryInfo = {
            ...dataObj.queryInfo,
            mfgordername: '',
            productname: '',
            containername: '',
            specno: '',
            instorestatus: '未入库'
          };
          dataObj.dataList = [];
          dataObj.containerList = [];
          dataObj.currentPage = 1;
        }

        onMounted(async () => {
          const [userInfo, factoryList] = await Promise.all([
            getUserInfo(),
            getFactoryList()
          ]);
          dataObj.factoryList = factoryList;
          if (userInfo && userInfo.FactoryID) {
            dataObj.queryInfo.factoryid = userInfo.FactoryID;
            dataObj.factoryidDisabled = true;//用户若有指定分厂，分厂不允许选择
          }
        })

        return {
          splitDate, replaceDate, dataObj,
          handleCurrentChange, handleSizeChange,
          getData, resetData,
          handleInstoreClick, handleCancleInstoreClick,
          dataTableRef, containerListRef,
          getMfgordernameAsync, getProductnameAsync, getContainernameAsync,

          handleRowClick, handleInstoreStatusChange,

          instoreObj,
          instoreObjFormRef,
          instoreObjTableRef,
          byproductFormRef,//副产品维护表单ref
          instoreObjContainerTableRef,//单件单卡批次表格ref
          handleInstoreAddClick,
          handleInstoreDeleteClick,
          handleInstoreConfirmClick,//确认入库信息按钮
          handleInstoreSubmitClick,//【提交】按钮点击
          handleInstoreCellBlur,//批次表格单元格blur事件
        }
      }
    };
    const app = createApp(App);
    app.use(ElementPlus, { locale: ElementPlusLocaleZhCn });
    // 注册所有icon
    for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
      switch (key) {
        default:
          app.component(key, component)
          break;
      }
    }

    app.mount('#app');
  </script>
</body>

</html>